<template>
  <div class="mod-user">
    <el-dialog
      :close-on-click-modal="false"
      :visible.sync="visible"
      width="35%">
      <el-tabs type="border-card">
        <el-tab-pane :label="!dataForm.id ? '新增' : '修改'">
          <el-form :inline="true" :model="dataForm" :rules="dataRule" ref="dataForm" class="data-form">
            <el-row >
              <el-form-item label="关键词:" prop="keyWord">
                <el-input v-model="dataForm.keyWord" placeholder="关键词" clearable style="width:406px"></el-input><br/>
                <label>提示：搜索词不可重复</label>
              </el-form-item>
            </el-row>

            <el-row>
              <el-form-item label="跳转类型:">
                <el-select v-model.trim="dataForm.jumpType" filterable placeholder="选择/搜索" @change="getUpgradeInfo(true)" style="width: 110px">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="跳转地址/ID:" v-if="dataForm.jumpType != '20'">
              <el-input v-model="dataForm.jumpUrl" placeholder="请输入跳转路径"  style="width:291px"/>
              </el-form-item>
              <el-form-item label="邀请人账号:" v-if="dataForm.jumpType == '20'">
                <el-select v-model.trim="userId" filterable placeholder="选择/搜索" @change="saveJumpUrl" style="width: 170px">
                  <el-option
                    v-for="item in upgradeList"
                    :key="item.id"
                    :label="item.userName"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-row>
            <el-row>
              <el-form-item label="备注声明:">
                <textarea v-model="dataForm.remarks" style="width:414px; height:60px"></textarea>
              </el-form-item>
            </el-row>

            <el-row>
              <el-form-item :inline="true">
                <div align="right" style="width: 487px">
                  <el-button :disabled="this.disabled" @click="preservationHandle()">保存</el-button>
                </div>
              </el-form-item>
            </el-row>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data () {
    var checkKeyWord = (rule, value, callback) => {
      debugger
      if (value === '') {
        callback(this.$message.error('请输入搜词'))
      }
      this.flag(value)
    }
    return {
      disabled: false,
      visible: false,
      regFlag: false,
      userId: '',
      dataForm: {
        id: 0,
        keyWord: '',
        jumpType: '',
        remarks: '',
        jumpUrl: ''
      },
      keyWordList: [],
      upgradeList: [],
      options: [],
      dataRule: {
        keyWord: [
          { validator: checkKeyWord, required: true, trigger: 'blur' }
        ]
      }
    }
  },
  components: {
  },
  activated () {
  },
  methods: {
    init (keyWordList, id) {
      this.disabled = false
      this.dataForm.id = (id = undefined ? 0 : id) || 0
      this.userId = ''
      this.dataForm.keyWord = ''
      this.dataForm.jumpType = ''
      this.dataForm.remarks = ''
      this.dataForm.jumpUrl = ''
      this.visible = true
      debugger
      this.keyWordList = keyWordList
      debugger
      this.saveJsonObject()
      this.getUpgradeInfo(true)
      this.$nextTick(() => {
        /* if (this.$refs['dataForm'] !== undefined) {
          this.$refs['dataForm'].resetFields()
        } */
        if (this.dataForm.id) {
          this.$http({
            url: this.$http.adornUrl(`/egg/getUpgradeById/${this.dataForm.id}`),
            method: 'get',
            params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.dataForm.id = data.data.id
              this.dataForm.keyWord = data.data.keyWord
              for (var i = 0; i < this.keyWordList.length; i++) {
                if (this.keyWordList[i] === data.data.keyWord) {
                  this.keyWordList.splice(i, 1)
                }
              }
              this.dataForm.jumpType = data.data.jumpType + ''
              if (data.data.jumpType === 20) {
                let index1 = data.data.jumpUrl.lastIndexOf('?')
                let index2 = data.data.jumpUrl.lastIndexOf('=')
                this.dataForm.jumpUrl = data.data.jumpUrl.substring(0, index1)
                this.userId = data.data.jumpUrl.substring(index2 + 1, data.data.jumpUrl.length)
              } else {
                this.dataForm.jumpUrl = data.data.jumpUrl
              }
              this.dataForm.remarks = data.data.remarks
            }
          })
        }
      })
    },
    preservationHandle () {
      this.disabled = true
      debugger
      if (this.dataForm.keyWord === '') {
        this.disabled = false
        return this.$message.error('关建词不能为空')
      } else if (this.flag(this.dataForm.keyWord)) {
        this.regFlag = false
        this.disabled = false
        return this.$message.error('搜词重复')
      } else if (this.dataForm.jumpType === '') {
        this.disabled = false
        return this.$message.error('请选择跳转类型')
      } else if (this.dataForm.jumpType !== '20' && this.dataForm.jumpUrl === '') {
        this.disabled = false
        return this.$message.error('请输转跳的路径')
      } else if (this.dataForm.jumpType === '20' && this.userId === '') {
        this.disabled = false
        return this.$message.error('请绑定关联信息')
      }
      this.$http({
        url: this.$http.adornUrl(`/egg/${!this.dataForm.id ? 'addUpgradeInfo' : 'modifyUpgradeInfo'}`),
        method: 'post',
        data: this.$http.adornData({
          'id': this.dataForm.id || undefined,
          'keyWord': this.dataForm.keyWord,
          'jumpType': this.dataForm.jumpType,
          'jumpUrl': this.dataForm.jumpType === '20' ? this.dataForm.jumpUrl = this.userId : this.dataForm.jumpUrl,
          'remarks': this.dataForm.remarks
        })
      }).then(({data}) => {
        if (data && data.code === 0) {
          this.$message({
            message: '操作成功',
            type: 'success',
            duration: 800,
            onClose: () => {
              this.visible = false
              this.$emit('refreshDataList')
            }
          })
        } else {
          this.$message.error(data.msg)
        }
      })
    },
    flag (value) {
      let regValue = value
      for (let i = 0; i < this.keyWordList.length; i++) {
        if (regValue === this.keyWordList[i]) {
          this.regFlag = true
          return this.regFlag
        }
      }
    },
    saveJumpUrl () {
      this.dataForm.jumpUrl = this.dataForm.userId
    },
    saveJsonObject () {
      this.options = [
        {value: '0', label: '商品分类'},
        {value: '1', label: '联盟店分类'},
        {value: '2', label: '活动'},
        {value: '3', label: '外链'},
        {value: '4', label: '店铺'},
        {value: '5', label: '专题'},
        {value: '6', label: '无跳转'},
        {value: '7', label: '商品'},
        {value: '8', label: '品牌'},
        {value: '12', label: '特殊处理'},
        {value: '13', label: '分享'},
        {value: '14', label: '分类导航页'},
        {value: '17', label: '商城一级分类'},
        {value: '18', label: '采购'},
        {value: '19', label: '签到'},
        {value: '20', label: '采蛋升级'}
      ]
    },
    getUpgradeInfo (flag) {
      // 请求彩蛋升级信息
      debugger
      this.$http({
        url: this.$http.adornUrl(`/egg/getUpgradeInfo/`),
        method: 'get',
        params: this.$http.adornParams()
      }).then(({data}) => {
        if (data && data.code === 0) {
          this.upgradeList = data.data
        }
      })
    }
  }
}
</script>
<style>
  .el-upload__tip {
    margin-left: 277px;
  }
</style>
